<template>
	<div id="app">
		<!-- <div id="nav">
      <router-link to="/">Home</router-link> |
      <router-link to="/about">About</router-link>
    </div> -->
		<router-view />
		<!-- <div id="" style="width: 100vw;height: 10vh;">

		</div>
		<div class="tabbar">
			<div class="tabbar_list">
				<router-link to="/">
					<div>
						<van-icon name="wap-home-o" size="30px" />
					</div>
					<div>首页</div>
				</router-link>
			</div>
			<div class="tabbar_list">
				<router-link to="/about">
					<div>
						<van-icon name="records" size="30px" />
					</div>
					<div>论坛</div>
				</router-link>
			</div>
			<div class="tabbar_list">
				<router-link to="/cart">
					<div>
						<van-icon name="shopping-cart-o" size="30px" />
					</div>
					<div>购物车</div>
				</router-link>
			</div>
			<div class="tabbar_list">
				<router-link to="/mine">
					<div>
						<van-icon name="contact" size="30px" />
					</div>
					<div>我的</div>
				</router-link>
			</div>
		</div> -->
	</div>
</template>
<script type="text/javascript">
	export default {
		data() {
			return {

			}
		}
	}
</script>
<style>
	html {
		font-size: 312.5%;
		width: 100%;
		height: 100%;
	}

	#app {
		font-family: Avenir, Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-align: center;
		color: #2c3e50;
	}

	#nav {
		padding: 30px;
	}

	#nav a {
		font-weight: bold;
		color: #2c3e50;
	}

	#nav a.router-link-exact-active {
		color: #42b983;
	}

	/* .tabbar a {

		color: #999999;
	}

	.tabbar a.router-link-exact-active {
		font-weight: bold;
		color: #222222;
	}

	.tabbar {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		background-color: #FFFFFF;
		position: fixed;
		bottom: 0;
		height: 8vh;
	}

	.tabbar_list {
		width: 25%;
		font-size: 14px;
	} */
</style>
